import React, { useEffect, useState } from 'react'
import { Descriptions, Popconfirm, Card, Col, Table, Row, Button, Input, Select } from 'antd';
import myinfo from "../../mobx/info";
import { UploadOutlined, DownloadOutlined, FormOutlined, DeleteOutlined, FolderViewOutlined } from '@ant-design/icons';
import { ajax } from '../../api';
import { observer } from 'mobx-react';
import { baseURL } from '../../api/request';
import moment from '_moment@2.29.1@moment';
import { toast } from '../../utils/commom';

function Recruiting({ history }: any) {
    const { Column, ColumnGroup } = Table;
    const { getExecutiveListAsync, userInfo, executiveList } = myinfo
    const list = JSON.parse(JSON.stringify(executiveList))
    const role = JSON.parse(JSON.stringify(userInfo)).role
    const [flag,setFlag]=useState(false)
    useEffect(() => {
        getExecutiveListAsync({})
        console.log(list)
        if(role>3){
            setFlag(true)
        }
    }, [])
  
  
    const confirm = async (item: any, index: any) => {
        console.log(item)
        // 前端删除
        executiveList.splice(index,1)
        // 后端删除
        let {result,code}:any=await ajax.deleteRecruing({_id:item._id})
        if(code==200){
            toast.success("删除成功")
        }

    }
    return (
        <div >

            <Row style={{ marginTop: 20 }}>
                <Col>
                    <Table
                        dataSource={list}
                        sticky
                        bordered
                        id="table"
                        pagination={{ pageSize: 6 }}
                        rowKey={(item: any) => item._id}
                    >
                        <Column
                            title='#'
                            align="center"
                            render={(text, item, index) => (
                                <b>{index + 1}</b>
                            )}
                        />

                        <Column
                            title='招聘名称'
                            align="center"
                            key='title'
                            dataIndex='title'

                        />

                        <Column
                            title='招聘人'
                            align="center"
                            key='username'
                            dataIndex='username'

                        />

                        <Column
                            title='发表时间'
                            align="center"
                            key='time'
                            dataIndex='time'
                            render={(text, item, index) => (
                                <p>{moment(text).format('YYYY-MM-DD HH:MM')}</p>
                            )}
                        />

                        <Column
                            title='招聘内容'
                            align="center"
                            key='content'
                            dataIndex='content'
                        />
                        <Column
                            title='联系电话'
                            align="center"
                            key='phone'
                            dataIndex='phone'
                        />

                            {
                              flag&& <Column
                                    title='操作'
                                    align="center"
                                    render={(text, item, index) => (
                                        <Popconfirm
                                            title="你真的要删除吗?"
                                            onConfirm={() => confirm(item, index)}
                                            okText="确定"
                                            cancelText="不了"
                                        >
                                            <Button danger size="small">删除</Button>
                                        </Popconfirm>
                                    )}
                                />
                            }

                    </Table>
                </Col>
            </Row>
        </div>
    )
}

export default observer(Recruiting)